<template>
  <div class="left">
    <p v-hello>left</p>
    <p v-abc>{{uname}}</p>
  </div>
</template>

<script>
export default {
props:['uname'],
directives:{
  abc:{
    update(el){
      console.log(el.innerHTML);
    },
    componentUpdated(el){
      console.log(el.innerHTML);
    }
  }
}
}
</script>

<style>
   .left{
     width: 400px;
    height: 250px;
    background-color: pink;
   }
</style>